<template>
	<view class="content padding-30 u-cb-white-bg">
		<view class="mt-80">
			<!-- <view class="u-text-align-center fsize-36 mb-40">￥{{form.amount}}</view> -->
			<u-form 
				:model="form"
				:rules="rules"
				ref="uForm"
				labelWidth="80"
				errorType="toast">
				<u-form-item label="支付金额" prop="amount" borderBottom>
					<view class="u-flex">
						<view class="t-icon t-icon-yue mr-10" />
						<u-input
							type="digit"
							:focus="true"
							placeholder="请输入支付金额"
							v-model="form.amount"
							border="none">
						</u-input>
					</view>
				</u-form-item>
				<u-form-item label="支付密码" prop="password" borderBottom>
					<u-input
						type="password"
						placeholder="请输入支付密码"
						v-model="form.password"
						border="none">
					</u-input>
				</u-form-item>
			</u-form>
			<view class="mt-60">
				<u-button text="确认支付" type="error" @click="onSubmit" />
			</view>
		</view>
		<u-modal 
			:show="isShowPayment" 
			:title="title" 
			:content='content' 
			@confirm="$u.route({url:'/pages/home/index-member',type:'redirectTo'})"/>
	</view>
</template>

<script>
	export default{
		data(){
			return {
				isShowPayment: false,
				content:'',
				title:'',
				form:{
					password:'',
					amount: 0,
					explain:'',
					casher_appid: '',
				},
				rules:{
					amount:[
						{
							required: true, 
							message: '请输入支付金额',
							trigger: ['change','blur'],
						},{
							validator:(rule, value, callback)=>{
								return uni.$u.test.amount(value)
							},
							message: '请输入支付金额',
							// 触发器可以同时用blur和change
							trigger: ['change','blur'],
						}
					],
					password:[
						{
							required: true, 
							message: '请输入密码',
							trigger: ['change','blur'],
						},
					]
				}
			}
		},
		onReady() {
			this.$refs.uForm.setRules(this.rules)
		},
		onLoad(option){
			let sce = decodeURIComponent(option.scene)
			let arr = sce.split(':');
			this.form.casher_appid = arr[0]
			this.form.amount = arr[1]
		},
		methods:{
			onSubmit(){
				let that = this
				this.$refs.uForm.validate().then(res => {
					that.$reqPost('/SetMemberConsume', that.form).then(res=>{
						that.isShowPayment = true
						that.content = res.Message
						that.title = res.Data[0].FMessage
						let info = {
							...uni.getStorageSync('userInfo'),
							FAmount:res.Data[0].mSpareJe,
							FIntegral:res.Data[0].mSpareFs
						}
						uni.setStorageSync('userInfo',info)
					})
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.content{
		height:100vh;
	}
</style>